<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="index.css"/>
		<title>免费BMI指数计算器</title>
	</head>

	<body>
		<main>
			<form action="">
				<table id="table1">
					<caption>
						<h1>免费计算你的身体质量指数（BMI）</h1></caption>
					<!--第一行-->
					<tr>
						<td id="result" colspan="3">你的 BMI值:<span id="BMI-value">22.1</span>,身体状态:<span id="status">正常</span></td>
					</tr>
					<tr>
						<td>度量单位：</td>
						<td>
							<input type="radio" name="unit" checked="checked" id="gz" />
							<label for="gz">公制</label>
							<input type="radio" name="yz" id="yz" value="" />
							<label for="yz">英制</label>
						</td>
						<td></td>
					</tr>
					<!--第二行-->
					<tr>
						<td>我的身高：</td>
						<td>
							<input type="text" name="" id="height-data" value="" />
						</td>
						<td>单位：厘米&nbsp;cm</td>
					</tr>
					<!--第三行-->
					<tr>
						<td>我的体重：</td>
						<td><input type="text" name="" id="weight-data" value="" /></td>
						<td>单位： 千克&nbsp;kg</td>
					</tr>
					<!--第四行-->
					<tr>
						<td>BMI 标准：</td>
						<td>
							<!--下拉菜单select-->
							<select name="" id="">
								<option value="">国际标准</option>
								<!--默认选中selected="selected"-->
								<option value="" selected="selected">中国标准</option>
								<option value="">日本标准</option>
								<option value="">新加坡标准</option>
							</select>
						</td>
						<td></td>
					</tr>
					<!--第五行-->
					<tr>
						<td></td>
						<td>
							<!--id名字和for的名字一样，形成大项选择-->
							<input type="checkbox" name="" id="save-record" checked="checked" />
							<label for="save-record">自动保存 BMI历史记录</label>
						</td>
						<td></td>
					</tr>
					<!--第六行-->
					<tr>
						<td></td>
						<td>
							<input type="button" name="" id="calcBth" value="计算 BMI" />
						</td>
						<td></td>
					</tr>
				</table>
			</form>
			<section>
				<table id="table2">
					<caption><h4>BMI中国标准</h4></caption>
					<tr>
						<td>分类</td>
						<td>BMI范围</td>
					</tr>
					<tr>
						<td>偏瘦</td>
						<!--字符实体<号-->
						<td>&lt;= 18.4</td>
					</tr>
					<tr>
						<td>正常</td>
						<td>18.5-23.9</td>
					</tr>
					<tr>
						<td>过重</td>
						<td>24.0-27.9</td>
					</tr>
					<tr>
						<td>肥胖</td>
						<td>&gt;= 28.0</td>
					</tr>
					
				</table>
			</section>
		</main>
		<script type="text/javascript" src="calc1.js">
			
		</script>
	</body>

</html>